<template>
	<view class="uy-flex uy-flex-wrap uy-flex-between">
		<view class="uy-bs-000000" :style="itemStyle" v-for="(item,index) in list" :key="index">
			<uy-image :width="imgWidth" :height="imgHeight" :src="item[imgKey] || ''" radius="5"></uy-image>
			<view class="uy-p-10 uy-h-185 uy-rel">
				<view class="uy-line-2 uy-font-26">
					<view class="uy-flex-inline uy-m-r-10">
						<uy-image width="25" height="25" :src="item.image"></uy-image>
					</view>
					{{item.name || ''}}
				</view>
				<view class="uy-font-22 uy-color-999999 uy-flex uy-abs uy-b-95">
					<view class="uy-w-30 uy-h-30 uy-m-r-5">
						<uni-icons type="shop" size="15" color="#999999"></uni-icons>
					</view>
					{{item.shop_name || ''}}
				</view>
				<view class="uy-font-28 uy-font-w-600 uy-color-FF0000 uy-abs uy-b-50">
					<text class="uy-font-22 uy-font-w-500">{{$mConstDataConfig.moneySymbol}}</text>
					{{item.price || '0.00'}}
					<text class="uy-font-22 uy-m-l-5 uy-font-w-500">劵后</text>
					<text class="uy-color-666666 uy-m-l-20 uy-font-22 uy-font-w-500">月销10万</text>
				</view>
				<view class="uy-flex uy-font-20 uy-abs uy-b-15">
					<view class="uy-bg-FFA115 uy-w-130  uy-m-r-20 uy-b-r-5 uy-rel uy-p-r-5 uy-flex">
						<view class="uy-w-50 uy-text-c uy-bg-000000 uy-color-FFA115" style="clip-path: polygon(0 0, 100% 0, 22px 100%, 0 100%);">返</view>
						<view class="uy-text-c uy-flex-1 uy-font-18 uy-color-333333">10元</view>
						<view class="uy-bg-FFFFFF uy-w-10 uy-h-10 uy-b-r-p-50 uy-abs uy-l--5 uy-b-0 uy-t-0 uy-m-a"></view>
						<view class="uy-bg-FFFFFF uy-w-10 uy-h-10 uy-b-r-p-50 uy-abs uy-r--5 uy-b-0 uy-t-0 uy-m-a"></view>
					</view>
					<view class="uy-bg-FF754C uy-w-130 uy-b-r-5 uy-rel uy-p-l-5 uy-flex">
						<view class="uy-w-35 uy-text-c uy-color-FFFFFF uy-m-l-5" style="border-right: 1rpx dashed #FFFFFF;">劵</view>
						<view class="uy-text-c uy-flex-1 uy-font-18 uy-color-FFFFFF">21元</view>
						<view class="uy-bg-FFFFFF uy-w-10 uy-h-10 uy-b-r-p-50 uy-abs uy-l--5 uy-b-0 uy-t-0 uy-m-a"></view>
						<view class="uy-bg-FFFFFF uy-w-10 uy-h-10 uy-b-r-p-50 uy-abs uy-r--5 uy-b-0 uy-t-0 uy-m-a"></view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		name:"uy-list-goods",
		props: {
			list: {
				type: Array,
				default: () => []
			},
			imgW: {
				type: [Number, String],
				default: 0
			},
			imgH: {
				type: [Number, String],
				default: 0
			},
			imgKey: {
				type: String,
				default: 'image'
			},
			rowNum: {
				type: [Number, String],
				default: 1
			},
			interval: {
				type: [Number, String],
				default: 0
			},
			bgColor: {
				type: String,
				default: '#FFFFFF'
			}
		},
		data() {
			return {
				
			};
		},
		computed: {
			itemStyle() {
				let obj = uni.getSystemInfoSync();
				return `width: ${(obj.windowWidth - Number(this.interval)) / Number(this.rowNum) - Number(this.interval)}px;background: ${this.bgColor};margin-top: ${this.interval}px;`
			},
			imgWidth() {
				let obj = uni.getSystemInfoSync();
				uni.getSystemInfo({
					success: res => {
						obj = res;
					}
				})
				return this.imgW || uni.$uy.pxToRpx(obj.windowWidth / Number(this.rowNum) - (Number(this.interval) * Number(this.rowNum)))
			},
			imgHeight() {
				let obj, interval = uni.$uy.rpxToPx(this.interval);
				uni.getSystemInfo({
					success: res => {
						obj = res;
					}
				})
				return this.imgH || uni.$uy.pxToRpx((obj.windowWidth - interval) / 2)
			}
		}
	}
</script>

<style>

</style>